<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<title>Fair Urban</title>
</head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html {
	height: 100%
}

body {
	height: 100%;
	margin: 0;
	padding: 0
}

#map_canvas {
	height: 100%
}

.loginform
{
	background-color:white;
}

.clsTable
{
	border: 0;
	border-collapse:separate; 
	border-spacing:2em;
	border-width: 1px; 
	border-color:#000000; 
	border-style: solid;
}

.clsResults
{
	border: 0;
	border-collapse:separate; 
	border-spacing:2em;
	border-width: 1px; 
	border-color:#000000; 
	border-style: solid;
}

.reqVal
{
	color: red;
	display: none;
}
</style>
<link href="http://fonts.googleapis.com/css?family=Montserrat:400,700"
	rel="stylesheet" type="text/css" />
<link href="css/default.css" rel="stylesheet" type="text/css"
	media="all" />

<script type="text/javascript"
	src="http://code.jquery.com/jquery-1.8.2.min.js"></script>

<script type="text/javascript" src="js/jquery.lightbox_me.js"></script>

<script type="text/javascript">
	$(document).ready(function() {
		
		$('#tblResults').hide();
		
		IsLoggedIn();
		
		$('#spnLogin').click(function(e) {
		    $('#divlogin').lightbox_me({
		        centered: true, 
		        onLoad: function() { 
		            $('#sign_up').find('input:first').focus()
		            }
		        });
		    e.preventDefault();
		});
		
		//testuser - swe574TEST!
		$('#frmlogin').submit(function() {
			
			if($('#username').val() == "" || $('#password').val() == "")
			{
				if($('#username').val() == ""){$('#reqUser').show();}else{$('#reqUser').hide();}
				if($('#password').val() == ""){$('#reqPass').show();}else{$('#reqPass').hide();}
				return false;
			}
			else
			{
				//alert($("#frmlogin").serialize())
				$.ajax({
					type: 'POST',
					data: $("#frmlogin").serialize(),
		          	url: './service/login/sigin',
		            success: function(msg,textStatus) {
		            	//alert("Başarıyla giriş yaptınız!");
		            	//$('#spnLogout').show();
	 					//$('#spnLogin').hide();
		            	$('#divlogin').trigger('close');
		            	IsLoggedIn();
		            },
		            error:function(jqXHR, textStatus, errorThrown){
			          alert("Yanlış kullanıcı adı/şifre, lütfen tekrar deneyiniz.");
		              //alert(errorThrown);
		            }
		        });
				  return false;
			}	
		});
		

		//jQuery.support.cors = true;

		//var getCategoriesUrl = 'http://172.20.2.5:8080/RestAccessibilty/service/categories';
		//var getCategoriesUrl = 'http://testpalette.com:8080/RestAccessibilty/service/categories';
		var getCategoriesUrl = './service/categories';
		var getEntriesByCategoryUrl = './service/entries?categoryId=';
		
//			var getPrioritiesUrl = './service/priorities';
//			var selectPriorities = $('#ddlPriorities');
//			$.getJSON(getPrioritiesUrl, function(data) {
//				$.each(data['data'], function(index, element) {
//					$(selectPriorities).append(
//							$('<option></option>').val(element.id)
//									.html(element.title));
//				});
//			});

		var selectParent = $('#ddlCategories');
		var selectChild = $('#ddlChildren');
		$.getJSON(getCategoriesUrl, function(data) {
			// 			$.each(data['data'], function(index, element) {
			// 		        $('#feed').append(element.id + " " + element.title + " " + " " + element.parentReasonId + "</br>");
			// 		        $.each(element.violationTypes, function(index, element2)
			// 		        {
			// 		        	$('#feed').append(element2.id + " " + element2.title + " " + " " + element2.description + " " + element2.imageMeta);
			// 		        });
			// 		    });
			$.each(data['data'], function(index, element) {
				$(selectParent).append(
						$('<option></option>').val(element.id)
								.html(element.title));
			});
		});

		selectParent.change(function() {
					if (selectParent.find(":selected").val() == "0") {
						selectChild.hide();
						selectChild.val("0");
					} else {
						selectChild.empty();
						selectChild.append($('<option></option>').val(0).html("Tamamı"));
						$.getJSON(getCategoriesUrl
												+ "/"
												+ selectParent.find(":selected").val(),
										function(data) {
											$.each(data['data'],function(index,element) {
																selectChild.append($('<option></option>')
																				.val(element.id)
																				.html(element.title));
											});
											selectChild.show();
										});
					}
				});

		selectChild.change(function() {});

		$('#btnSearch').click(function() {
			
			$('#tblResults').find("tr:gt(0)").remove();
			
			$("#ddlPriorities option[value='0']")[0].selected = true;
			
							var valToSearch = 0;
							if (selectChild.val() == "0") 
							{
								valToSearch = selectParent.val();
							} 
							else if(selectChild.val() == null)
							{
								valToSearch = 0;
							}
							else
							{
								valToSearch = selectChild.val();
							}
							
							var searchUrl = "";
							var getAllEntriesUrl = "./service/entries";
							
							if(valToSearch != "0")
							{
								searchUrl = getEntriesByCategoryUrl + valToSearch;
							}
							else
							{
								searchUrl = getAllEntriesUrl;
							}

							var scriptUrl = searchUrl;
							
							var loggedIn = $('#loggedMu').val();
							
							$.ajax({
								url : scriptUrl,
								type : 'get',
								dataType : 'json',
								beforeSend : function() {
									$("#spinner").show();
								},
								complete : function() {
									$("#spinner").hide();
								},
								success : function(data) {
									var dataS = data['data'];

									$('#divCount').html("Filtreleme sonucu "
															+ dataS.length
															+ " adet ihlâl bulundu.");

									$.each(dataS, function(index,element) {
														var comment = element.comment;
														var entryId = element.id;
														var upVote = element.upVoteCount;
														var downVote = element.downVoteCount;
														var coordX = element.coordX;
														var coordY = element.coordY;
														var userName = element.userName;
														var image = element.imageMeta; //"images/generic.png";
														var priority = "<font color='olive'>Düşük</font>";
														var fixed = "";

														if(element.fixed)
														{
															fixed = "<font color='green'>Düzeltildi</font>";
														}
														else
														{
															fixed = "<font color='red'>Henüz düzeltilmedi</font>";
														}
														
														if(element.priority == "Low")
														{
															priority = "<font color='olive'>Düşük</font>";
														}
														else if(element.priority == "High")
														{
															priority = "<font color='orange'>Yüksek</font>";
														}
														else if(element.priority == "Critical")
														{
															priority = "<font color='red'>Kritik</font>";
														}
										
							
							$('#tblResults tr:last').after('<tr><td><a target="_blank" href="entry.html?id=' + entryId + '">' + entryId + '</a>' + '</td><td>' + userName + '</td>' +
									'<td>' + coordX + '</td>' + '<td>' + coordY + '</td>' + 
									'<td>' + '<a target="_blank" href="' + image + '">' + 
									'<img width="50px;" height="50px;" src="' + image + '"/></a>' + '</td>' +
									'<td>' + comment + '</td>' + '<td>' + upVote + '</td>' + '<td>' + downVote + '</td>' +
									'<td>' + priority + '</td>' + '<td>' + fixed + '</td>' +
									'</tr>');
							
							$('#tblResults').show();
							
									});
								},
								error : function(data) {
									alert("Bir hata oluştu, lütfen tekrar deneyin.");
								}
							});
							
						});
		
		
		
		$('#btnPrior').click(function() {
			
			$('#tblResults').find("tr:gt(0)").remove();
			
			$("#ddlCategories option[value='0']")[0].selected = true;
			$('#ddlChildren').hide();
			
			var valToSearch = 0;
			if ($('#ddlPriorities').find(":selected").val() == "0") 
			{
				valToSearch = "0";
			} 
			else
			{
				valToSearch = $('#ddlPriorities').find(":selected").val();
			}
			
			var searchUrl = "";
			var getAllEntriesUrl = "./service/entries";
			var getEntriesByPriorityUrl = './service/entries?priority=';
			
			if(valToSearch != "0")
			{
				searchUrl = getEntriesByPriorityUrl + valToSearch;
			}
			else
			{
				searchUrl = getAllEntriesUrl;
			}

			var scriptUrl = searchUrl;
			
			var loggedIn = $('#loggedMu').val();
			
			$.ajax({
				url : scriptUrl,
				type : 'get',
				dataType : 'json',
				beforeSend : function() {
					$("#spinner2").show();
				},
				complete : function() {
					$("#spinner2").hide();
				},
				success : function(data) {
					var dataS = data['data'];

					$('#divCount').html("Filtreleme sonucu "
											+ dataS.length
											+ " adet ihlâl bulundu.");

					$.each(dataS, function(index,element) {
						var comment = element.comment;
						var entryId = element.id;
						var upVote = element.upVoteCount;
						var downVote = element.downVoteCount;
						var coordX = element.coordX;
						var coordY = element.coordY;
						var userName = element.userName;
						var image = element.imageMeta; //"images/generic.png";
						var priority = "<font color='olive'>Düşük</font>";
						var fixed = "";

						if(element.fixed)
						{
							fixed = "<font color='green'>Düzeltildi</font>";
						}
						else
						{
							fixed = "<font color='red'>Henüz düzeltilmedi</font>";
						}
						
						if(element.priority == "Low")
						{
							priority = "<font color='olive'>Düşük</font>";
						}
						else if(element.priority == "High")
						{
							priority = "<font color='orange'>Yüksek</font>";
						}
						else if(element.priority == "Critical")
						{
							priority = "<font color='red'>Kritik</font>";
						}
		

$('#tblResults tr:last').after('<tr><td><a target="_blank" href="entry.html?id=' + entryId + '">' + entryId + '</a>' + '</td><td>' + userName + '</td>' +
	'<td>' + coordX + '</td>' + '<td>' + coordY + '</td>' + 
	'<td>' + '<a target="_blank" href="' + image + '">' + 
	'<img width="50px;" height="50px;" src="' + image + '"/></a>' + '</td>' +
	'<td>' + comment + '</td>' + '<td>' + upVote + '</td>' + '<td>' + downVote + '</td>' +
	'<td>' + priority + '</td>' + '<td>' + fixed + '</td>' +
	'</tr>');

$('#tblResults').show();

	});
				},
				error : function(data) {
					alert("Bir hata oluştu, lütfen tekrar deneyin.");
				}
			});
		});
		
		$('#btnUser').click(function() {
			
			$('#tblResults').find("tr:gt(0)").remove();
			
			$("#ddlCategories option[value='0']")[0].selected = true;
			$('#ddlChildren').hide();
			
			$("#ddlPriorities option[value='0']")[0].selected = true;
			
			var getAllEntriesUrl = "./service/entries";

			$.ajax({
				url : getAllEntriesUrl,
				type : 'get',
				dataType : 'json',
				beforeSend : function() {
					$("#spinner3").show();
				},
				complete : function() {
					$("#spinner3").hide();
				},
				success : function(data) {
					var dataS = data['data'];
					var ccount = 0;

					$.each(dataS, function(index,element) {
						
					if(element.userName == $('#spnUserName').val())
					{
						ccount = ccount + 1;
						
						var comment = element.comment;
						var entryId = element.id;
						var upVote = element.upVoteCount;
						var downVote = element.downVoteCount;
						var coordX = element.coordX;
						var coordY = element.coordY;
						var userName = element.userName;
						var image = element.imageMeta; //"images/generic.png";
						var priority = "<font color='olive'>Düşük</font>";
						var fixed = "";

						if(element.fixed)
						{
							fixed = "<font color='green'>Düzeltildi</font>";
						}
						else
						{
							fixed = "<font color='red'>Henüz düzeltilmedi</font>";
						}
						
						if(element.priority == "Low")
						{
							priority = "<font color='olive'>Düşük</font>";
						}
						else if(element.priority == "High")
						{
							priority = "<font color='orange'>Yüksek</font>";
						}
						else if(element.priority == "Critical")
						{
							priority = "<font color='red'>Kritik</font>";
						}
		

$('#tblResults tr:last').after('<tr><td><a target="_blank" href="entry.html?id=' + entryId + '">' + entryId + '</a>' + '</td><td>' + userName + '</td>' +
	'<td>' + coordX + '</td>' + '<td>' + coordY + '</td>' + 
	'<td>' + '<a target="_blank" href="' + image + '">' + 
	'<img width="50px;" height="50px;" src="' + image + '"/></a>' + '</td>' +
	'<td>' + comment + '</td>' + '<td>' + upVote + '</td>' + '<td>' + downVote + '</td>' +
	'<td>' + priority + '</td>' + '<td>' + fixed + '</td>' +
	'</tr>');
					}
					

$('#divCount').html("Filtreleme sonucu " + ccount + " adet ihlâl bulundu.");


	$('#tblResults').show();
	});
				},
				error : function(data) {
					alert("Bir hata oluştu, lütfen tekrar deneyin.");
				}
			});
		});
		
		
});
	
	var isLoggedInUrl = "./service/login/status";
	var logOutUrl = "./j_spring_security_logout";
	
	function IsLoggedIn() {
		$.ajax({
			url : isLoggedInUrl,
			type : 'get',
			success: function(msg){
				if(msg.loggedIn == true)
					{
					$('#welcomeText').show().html('Hoşgeldin ' + msg.username + '!');
 					$('#spnLogout').show();
 					$('#spnLogin').hide();
 					$('#liNewEntry').show();
 					$('#divByUser').show();
 					$('#spnUserName').val(msg.username);
					}
				else
					{
						$('#welcomeText').hide();
						$('#spnLogin').show();
						$('#spnLogout').hide();
						$('#liNewEntry').hide();
						$('#divByUser').hide();
					}
			},
			error: function(){}
		})
	};
	
	function logOut() {
		$.ajax({
			url : logOutUrl,
			type : 'get',
			complete: function(xhr, statusText){
				if(xhr.status == 200)
				{
	 				alert("Başarıyla çıkış yaptınız!");
	 				IsLoggedIn();
				}
				else
				{
					$('#spnLogout').show();
					$('#spnLogin').hide();
				}
		    }
		})
	};
</script>

<body>

<div class="loginform" style="display: none; border:#111" id="divlogin">
<form action="./service/login/sigin" accept-charset="UTF-8" method="post" id="frmlogin">
    <table class="clsTable">
       <tr>
         <td colspan="2"><span style="font-size: large;">Siteye giriş yapın</span></td>
       </tr>
       <tr>
         <td><label for="username">Kullanıcı adı:<span class="reqVal" id="reqUser">&nbsp;*</span></label></td>
         <td> <input type="text" maxlength="60" name="username" id="username" size="15" value="" class="required" style="float: right"></td>
       </tr>
       <tr>
         <td><label for="password">Şifre:<span class="reqVal" id="reqPass">&nbsp;*</span></label></td>
         <td> <input type="password" name="password" id="password" maxlength="60" size="15" class="required" style="float: right"></td>
       </tr>
       <tr>
         <td><input type="submit" name="submit" id="submit" value="Giriş"></td>
         <td></td>
       </tr>
       <tr>
         <td><a href="register.html" title="Üye olun!" style="font-size: 14px;">Kaydol</a></td>
         <td></td>
       </tr>
    </table>
	<input type="hidden" name="form_build_id" id="form-c1062bd63291587f665fe24a402917e9" value="form-c1062bd63291587f665fe24a402917e9">
	<input type="hidden" name="form_id" id="edit-user-login-block" value="user_login_block">
</form>
</div>
	<div id="wrapper" class="container">
		<input type="hidden" name="spnUserName" id="spnUserName" value="">
		<div id="header">
			<div id="logo">
				<a href="default.html"><img src="images/logo.png" width="25%;" style="float: left"></a>
				<h1 style="margin-top: 10px">  
					<a href="default.html">&nbsp;FAIR URBAN</a>
				</h1>
				<!-- 			<p>Alt Başlık</p> -->
			</div>
			<div id="menu">
				<ul>
					<li><a href="default.html">Ana Sayfa</a></li>
					<li><a href="about.html">Hakkımızda</a></li>
					<li id="liNewEntry"><a href="new.html">Yeni Ekle</a></li>
					<li class="current_page_item"><a href="report.html">Raporlama</a></li>
					<li><a id="spnLogin" style="display: none" href="javascript:;">GIRIS</a>
						<a id="spnLogout" style="display: none" href="javascript:;" onclick="logOut();" >ÇIKIS</a>
					</li>
				</ul>
			</div>
			<span style="display: none; float: right; margin-right: 20px; margin-top: 10px; font-weight: bold;" id="welcomeText"></span>
		</div>
		<div id="page" style="padding: 10px 0 0;">
			<div id="content">
				<div id="cbox1">
					<div>
						<h2>İhlâl Listeleme</h2>
						<span style="font-weight: bold;">Kategoriye göre:</span>&nbsp;&nbsp;
						<select id="ddlCategories">
							<option value="0">Tamamı</option>
						</select> <select id="ddlChildren" style="display: none">
							<!--<option value="0">Tamamı</option> -->
						</select> <input type="button" id="btnSearch" name="formSearch" value="Ara" style="font-weight: bold;" />
						<span id="spinner" class="spinner" style="display: none;"><img
							id="img-spinner" src="images/spinner.gif" alt="Yükleniyor" /> </span>
					</div>
					<p style="height: 12px"></p>
					<div> 
						<span style="font-weight: bold;">Önceliğe göre:</span>&nbsp;&nbsp;&nbsp;&nbsp;
						<select id="ddlPriorities">
							<option value="0">Tamamı</option>
							<option value="Low">Düşük</option>
							<option value="Critical">Kritik</option>
						</select> <input type="button" id="btnPrior" value="Ara" style="font-weight: bold;" />
						<span id="spinner2" class="spinner" style="display: none;"><img
							id="img-spinner" src="images/spinner.gif" alt="Yükleniyor" /> </span>
					</div>
					<p style="height: 12px"></p>
					<div id="divByUser"> 
						<span style="font-weight: bold;">Kendi girdiğim ihlâller</span>&nbsp;&nbsp;&nbsp;&nbsp;
						<input type="button" id="btnUser" value="Ara" style="font-weight: bold;" />
						<span id="spinner3" class="spinner" style="display: none;"><img
							id="img-spinner" src="images/spinner.gif" alt="Yükleniyor" /> </span>
					</div>
					<p style="height: 12px"></p>
					<div id="divCount" style="font-weight: bold;"></div>
				</div>
				<table id="tblResults" class="clsResults">
					<tr id="trHeader">
						<td><strong>Id</strong></td>
						<td><strong>Ekleyen</strong></td>
						<td><strong>X-Koordinatı</strong></td>
						<td><strong>Y-Koordinatı</strong></td>
						<td><strong>Fotoğraf</strong></td>
						<td><strong>Açıklama</strong></td>
						<td><strong>Acil Oy</strong></td>
						<td><strong>Bekleyebilir Oy</strong></td>
						<td><strong>Öncelik</strong></td>
						<td><strong>Düzeltildi Mi?</strong></td>
					</tr>
				</table>
					<p style="height: 10px;"></p>
					<a href="javascript: window.history.go(-1)" style="font-weight:bold; text-decoration: underline; color: #2AA8D2; font-size: 14px;"><--Geri</a>
					<p style="height: 5px;"></p>
			</div>
		</div>
	</div>
</body>
</html>
